// 选择图片
$('.select').on("click", function () {
    $('#file').click()
})

// 定义一个base64的字符串
let base64Str = ''
$('#file').on('change', function (e) {
    const files = e.target.files

    if (files.length === 0) {
        return
    }
    // window.URL 主要作用是读取文件的字符串,在img或video等带有src属性的标签上展示
    // window.URL.createObjectURL(object) file           
    const blobUrl = window.URL.createObjectURL(files[0])
    // 生成blob字符串  用来设置页面img身上的src属性
    $("#image").prop('src', blobUrl)

    // 将图片文件转化成base64字符串(base64字符串主要用于传输,跟图片相关)
    // 1. 声明一个js文件流
    let reader = new FileReader()
    if (files[0]) {
        // 2. 将图片文件转化成base64字符串
        reader.readAsDataURL(files[0])
        // 3. 通过监听事件 onloadend
        reader.onloadend = function () {
            base64Str = reader.result
        }
    }
})

// 上传头像
$('.sure').on('click', function () {
    if (!base64Str) {
        return layer.msg('请上传图片!')
    }
    // console.log('上传头像触发事件', base64Str)
    // console.log('上传头像触发事件', encodeURIComponent(base64Str))
    // 发送请求 ==> base64字符串
    // 数据格式: key=value  avatar=base64字符串
    // encodeURIComponent  前端的编码方式
    // decodeURIComponent 前端的解码方式
    const data = `avatar=${encodeURIComponent(base64Str)}`

    updateAvatarAPI(data, res => {
        layer.msg(res.message)
        if (res.status === 0) {
            window.parent.getUserInfo()
        }
    })
})

// 获取用户的个人信息
function selfUser() {
    getUserInfoAPI(res => {
        if (res.status === 0) {
            let {
                user_pic
            } = res.data
            if (user_pic)
                $('#image').prop('src', user_pic)
        }
    })
}
selfUser()